<template>
  <div class="weight-modal">
    <Modal
      class="modify-dialog"
      title="修改支付渠道权重"
      footer-hide
      :value="value"
      :mask-closable="false"
      @on-cancel="handleModalCancel">
      <Form
        ref="wForm"
        :model="wForm"
        :rules="wRules"
        :label-width="90"
        label-position="left">
        <FormItem label="客户号">
          <p>{{ wForm.customerNo }}</p>
        </FormItem>
        <FormItem label="支付渠道代号" prop="channelNo">
          <p>{{ wForm.channelNo }}</p>
        </FormItem>
        <FormItem label="权重" prop="weight">
          <Input placeholder="请输入数字" v-model="wForm.weight" number />
          <div class="form-item-info">
            <Icon type="ios-alert" size="14" color="#ff9900" class="icon-alert" />
            数字越大，权重越高
          </div>
        </FormItem>
        <FormItem style="margin-top: 48px;">
          <Button type="error"  @click="handleModalCancel" style="margin-right: 10px;">取消</Button>
          <Button type="primary"  @click="handleSubmit">确认提交</Button>
        </FormItem>
      </Form>
    </Modal>
  </div>
</template>

<script>
  import { deepCopy } from '@/libs/util';
  export default {
    name: 'weightModal',
    props: {
      value: {
        type: Boolean,
        default: false
      },
      wdata: {
        type: Object,
        default: function() {
          return {
            customerNo: '',
            channelNo: '',
            weight: ''
          }
        }
      }
    },
    data() {
      const validateNumber = (rule, value, callback) => {
        if (!Number.isInteger(value)) return callback(new Error('请输入数字'));
        return callback();
      }
      return {
        wForm: {},
        wRules: {
          weight: [
            { required: true, type: 'number', message: '请输入数字', trigger: 'blur' },
            { validator: validateNumber, trigger: 'blur' }
          ]
        }
      }
    },
    watch: {
      value (newValue) {
        if (newValue) {
          this.wForm = deepCopy(this.wdata);
        }
      }
    },
    methods: {
      // 权重弹窗 cancel
      handleModalCancel() {
        this.$refs.wForm.resetFields();
        this.$emit('input', false);
      },
      // 提价按钮
      handleSubmit() {
        const { wForm } = this.$refs;

        wForm.validate(valid => {
          if (valid) {
            this.$http.post('/helsinki/admin/finance/updateCustomerWeight', {
              ...this.wForm
            }).then(({ data: { errcode, info, data } }) => {
              if (errcode == 0) {
                this.$Message.success('修改权限成功');
                this.$emit('ok');
              }
            }, error => {
              console.log(error.statusText);
            });
          }
        })
      }
    }
  }
</script>

<style lang="scss" scoped>
  .form-item-info {
    font-size: 12px;
    color: #ff9900;
    .icon-alert {
      margin-top: -2px;
      margin-right: 2px;
    }
  }
</style>
